vec3 grid(in vec2 p) {
    vec3 cor = vec3(0.0);
//目的都是获取0-0.5之间的数据 因为一、二、三、四 象限分为了四大部分变化
// 范围都是0-0.5，所以分为了四大部分
    vec2 cell = fract(p.xy);
    if(cell.x < 2.0 * fwidth(p.x)) {
        cor = vec3(1.0, 1.0, 1.0);
    } else if(cell.y < 2.0 * fwidth(p.y)) {
        cor = vec3(1.0, 1.0, 1.0);
    }
    if(abs(p.x) < fwidth(p.x)) {
        cor = vec3(0.0, 1.0, 0.0);
    } else if(abs(p.y) < fwidth(p.y)) {
        cor = vec3(1.0, 0.0, 0.0);
    }
    return cor;
}
vec2 fixUV(in vec2 fragCoord) {
    return 6.0 * (fragCoord - 0.5 * iResolution.xy) / iResolution.xx;
}

float funcPlot(vec2 st, float line_width) {
        // 振幅 （即纵向拉伸压缩的倍数）
    float amplitude = 0.8+sin(iTime);

  // 角速度（控制波浪的周期）
    float angularVelocity = 12.0;
  // 偏距(表示波形在Y轴的位置关系)
    float b = 0.0;
  // 初相位(初相位是指正弦量在t=0时的相位，也称初相角或初相)
    float initialPhase =0.;
    float y = amplitude * sin((angularVelocity * st.x) + initialPhase) + b;
        //阶跃函数 如果y<st.y返回0，y>st.y返回1
    return step(y, st.y) - step(y + line_width, st.y);

}

void mainImage(out vec4 fragColor, in vec2 fragCoord) {
    vec2 p = fixUV(fragCoord);
    vec3 clor1 = vec3(0.0);
    vec3 color2 = vec3(funcPlot(p, 0.1));
    //为了更加方便改变线的颜色，采用mix方法进行线性插值，类似各个点颜色投影到
    // clor1,vec3(1.0,0.0,0.0) 这个线段上面。
    clor1 = mix(clor1, vec3(1.0, 0.0, 0.0), color2);
    vec3 color = grid(p);
    fragColor = vec4(color + clor1, 1.0);

}